<template>
  <!-- 选择分类 -->
  <el-select
    v-model="value"
    style="width: 100%"
    :placeholder="placeholder"
    :disabled="disabled"
    :size="size"
    clearable
    @change="handleChange"
  >
    <el-option v-for="v in tableData" :key="v.id" :label="v.name" :value="v.id">
    </el-option>
  </el-select>
</template>
<script>
export default {
  data() {
    return {
      value: '',
      listQuery: {
        page: 1,
        limit: 999,
        pid: 0,
        classType: 1,
        status: 1,
      },
      tableData: [],
    }
  },
  props: {
    defaultValue: String,
    type: {
      type: String,
      default: '1',
    },
    disabled: {
      type: Boolean,
      default: false,
    },
    size: {
      type: String,
      default: '',
    },
    placeholder: {
      type: String,
      default: '请选择分类',
    },
  },
  watch: {
    defaultValue: {
      immediate: true,
      handler(v) {
        this.value = v
      },
    },
  },
  mounted() {
    this.listQuery.classType = this.type
    this.getList()
  },
  methods: {
    async getList() {
      let res = await this.$store.dispatch('sysClassifyList', this.listQuery)
      this.tableData = res.data
    },
    handleChange(value) {
      this.$emit('emit', value)
    },
  },
}
</script>